<!DOCTYPE HTML>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,aItemress=no">
	<title>发布</title>
	<link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
	<link rel="stylesheet" type="text/css" href="../../../css/app.css" />
	<style type="text/css">
		body {
			color: #222222;
		}

		.flex-row-center {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
		}

		.aui-row {
			margin: 0 0.25rem;
		}

		.aui-row img {
			border-radius: 0.25rem;
		}

		.aui-row-padded [class*=aui-col-xs-] {
			padding: 0.25rem;
		}

		.ming-card-list-footer img {
			width: 1.1rem;
			display: inline-block;
			vertical-align: middle;
		}

		.nomessage {
			text-align: center;
			margin-top: 3.5rem;
		}

		.nomessage img {
			width: 100%;
			height: 4rem;
			margin-bottom: 1.2rem;
		}

		.history_footer {
			height: 2.55rem;
			display: flex;
			justify-content: space-between;
			padding: 0 0.75rem;
			align-items: center;
			font-size: 0.6rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(153, 153, 153, 1);
		}

		.history_footer>div:nth-child(2) {
			display: flex;
			justify-content: space-between;
		}

		.history_footer>div:nth-child(2)>div {
			display: flex;
			justify-content: center;
			align-items: center;
			margin-left: 1.8rem;
		}
		/*改写*/

		.status_title {
			background: #ffffff;
		}

		.status_title>div {
			display: flex;
			align-items: center;
			padding: 0.75rem 0 0.75rem 0;
			margin: 0 0.75rem 0 0.75rem;
			border-bottom: 1px solid rgba(238, 238, 238, 0.5);
		}

		.examine_fail {
			font-size: 0.75rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(232, 41, 41, 1);
		}

		.create_time {
			font-size: 0.6rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(153, 153, 153, 1);
		}

		.examine_in {
			font-size: 0.75rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(114, 213, 239, 1);
		}

		.content_history {
			padding: 0.75rem;
			padding-bottom: 0;
		}

		.content_history_cont {
			/*width: 17.25rem;*/
			overflow: hidden;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			font-size: 0.8rem;
			font-family: PingFangSC-Regular!important;
			font-weight: 400!important;
			color: rgba(34, 34, 34, 1)!important;
			line-height: 1.1rem;
			margin-bottom: 0.5rem;
		}

		.img_history {
			width: 100%;
			display: flex;
			justify-content: space-between;
		}

		.img_history img {
			width: 5.5rem;
			border-radius: 0.2rem;
		}

		.picture-list {
			margin-top: 0.2rem;
			overflow: hidden;
			margin-bottom: 0.75rem;
		}

		.picture-list .li {
			float: left;
			width: calc(33.33% - 0.28rem);
			margin-right: 0.4rem;
			margin-bottom: 0.06rem;
			height: 5.5rem;
		}

		.picture-list .li:nth-child(3n) {
			margin-right: 0;
		}

		.picture-list .li img {
			width: 100%;
			height: 100%;
			border-radius: 0.2rem;
		}

		.fail_bc {
			background: #FFFFFF!important;
		}

		.success_border {}

		.success_border .picture-list {
			padding-bottom: 0.75rem;
			margin-bottom: 0;
			border-bottom: 1px solid rgba(238, 238, 238, 0.5);
		}

		.expect_success_border {
			border-bottom: 0.5rem solid #F6F6F6;
		}

		.success_footer {
			padding: 0 0.75rem;
			height: 2.55rem;
			border-bottom: 0.5rem solid #F6F6F6;
		}

		.right_btn>div {
			margin-left: 1.8rem;
			font-size: 0.6rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(153, 153, 153, 1);
		}

		.right_btn>div img {
			margin-right: 0.15rem;
		}

		.sucess_no_img {
			/*padding-bottom: 0.75rem;*/
			/*margin-bottom: 0!important;*/
			/*border: 1px solid rgba(238, 238, 238, 0.5);*/
			height: 1px;
			background: rgba(238, 238, 238, 0.5)
		}

		.order-none {
			font-size: .75rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(34, 34, 34, 1);
		}

		.none-any {
			margin-top: 40%;
		}

		.none-any img {
			width: 5rem;
			height: 5rem;
			margin-left: 50%;
			transform: translateX(-50%);
		}

		.btn_play {
			position: absolute;
			width: 1.8rem;
			height: 1.8rem;
			left: calc(50% - 0.9rem);
			top: calc(50% - 0.9rem);
			z-index: 1000;
		}

		.btn_play img {
			width: 100%;
			height: 100%;
		}

		.newest_banner_only {
			width: 100%;
			height: 8.6rem;
		}

		.newest_banner_only>img {
			width: 100%;
			height: 8.6rem;
			border-radius: 0.2rem;
			display: block;
		}
		.publishXiubtn{
			width: 100%;
			height: 2.3rem;
			margin-bottom: 0.5rem;
			position: fixed;
			bottom:0;
		}
	</style>
</head>

<body>

	<div id="app" v-cloak="">
		<!---长按删除@touchstart="gtouchstart(vo.id)"-->
		<div v-for="vo in info"  ontouchmove="gtouchmove()" ontouchend="gtouchend()" :class="{'fail_bc':vo.status=='-1','success_border':vo.status=='1'}" style="background-color:#ffffff ;width:94%;margin:auto;border-radius:0.4rem 0.4rem 0.4rem 0.4rem !important;margin-top:0.5rem;">
			<!-- 头部状态 -->
			<div class="status_title" :class="{'fail_bc':vo.status=='-1'}" style="border-radius:0.4rem 0.4rem 0rem 0rem;">
				<div>
					<div >
						<div v-if="vo.status=='-1'" class="examine_fail" style="margin-right:0.75rem;color:rgba(233,0,0,1);">审核失败</div>
						<div v-if="vo.status=='0'" class="examine_in" style="margin-right:0.75rem;color:rgba(255,163,0,1);">审核中</div>
						<div v-if="vo.status!='-1'&&vo.status!='0'" class="examine_in" style="margin-right:0.75rem;color:rgba(0,90,147,1);">审核成功</div>
					</div>
					<!-- 时间 -->
					<!-- {{vo}} -->
					<div class="create_time" style="margin-right:auto">{{vo.create_time}}</div>
					<div v-if="vo.status=='-1'"  tapmode @click="openWin_publish_edit(vo.id)">
						<!--修改icon-->
						<img style="display: inline-block;width:1.1rem;" src="../../../image/icon/btn-change.png" style="width:0.9rem;height:0.9rem;"/>
					</div>
					<div v-if="vo.status=='-1'" style="margin-left:1.25rem;">
							<!--删除icon-->
						<img style="display: inline-block;width:1.1rem;" src="../../../image/icon/btn-del.png" style="width:0.9rem;height:0.9rem;" @click="del(vo.id)"/>
					</div>
				</div>
			</div>
			<!-- 头像\昵称\时间 -->
			<div class="flex-row-center" style="width:93%;margin:auto;height: 2rem;margin-top:0.55rem;">
				<div style="width: 1.8rem;margin-right:0.25rem;">
					<img :src="vo.avatar" class="aui-img-round">
				</div>
				<div style="display:flex;width:100%;height:100%;">
					<div style="flex:6;display:flex;flex-direction:column;overflow:hidden;">
						<span style="flex:1;font-size:.6rem;font-family:PingFangSC-Regular;font-weight:400;color:rgba(46,46,46,1);">
											{{vo.nickname}}
							</span>
						<span class="aui-ellipsis-1" style="flex:1;font-size:.6rem;font-family:PingFangSC-Regular;font-weight:400;color:rgba(187,187,187,1);">
											{{vo.create_time}}
							</span>
					</div>
				</div>
			</div>
			<!-- 内容 -->
			<div class="content_history" style="border-radius:0rem 0rem 0.4rem 0.4rem;background-color:#ffffff;" :class="{'expect_success_border':vo.status !='1'}">
				<!---标题--->
				<div style="color:blue;overflow:auto;font-weight:500;color:rgba(77,77,77,1);font-size:0.75rem;">
					{{vo.title}}
				</div>
				<div tapmode @click="next(vo.status,vo.id,'发布详情')" class="content_history_cont" v-html="vo.content.replace(/\n/g, '<br/>')" style="overflow:auto;font-size:0.7rem !important;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:rgba(128,128,128,1) !important;">
				</div>
				<div :class="{'sucess_no_img':vo.img_path.length == 0 && vo.status =='1'}" >

				</div>
				<div class="picture-list">
					<div v-for="(item,index) in vo.video_path" style="position:relative;" :class="{'li' : vo.video_path.length > 1 || vo.img_path.length > 1 || vo.video_path.length == 1 && vo.img_path.length == 1,'newest_banner_only' : vo.video_path.length == 1 && vo.img_path.length == 0}">
						<img :src="item" alt="">
						<!-- 播放按钮 -->
						<div class="btn_play" tapmode @click="videoPlay(vo.video[index])">
							<img src="../../../image/bg/bg_video.png" alt="">
						</div>
					</div>
					<div class="li" v-for="(item,index) in vo.img_path" tapmode @click.stop="showimg(vo.img_path,index)">
						<img :src="item" alt="">
					</div>
				</div>
			</div>
			<!-- 审核通过后分享等按钮 -->
			<div class="success_footer" v-if="vo.status!='-1'&&vo.status!='0'" style="width:100%;display:flex;justify-content:space-between;align-items:center;">
				<div class="right_btn" style="display:flex;align-items:center;" tapmode @click="next(vo.status,vo.id)">
					<div style="width:4rem;float:left;display:flex;align-items:center;margin-left:1.9rem;">
						<img v-if="vo.is_zan=='0'" src="../../../image/icon/icon-zan.png" style="width:0.9rem;height:0.85rem;" />
						<img v-if="vo.is_zan=='1'" src="../../../image/icon/icon-zan-active.png" style="width:0.9rem;height:0.85rem;" />
						<div style="margin-left:0.4rem;">
							{{vo.zan_num}}
						</div>
					</div>
					<div style="width:4rem;float:left;display:flex;align-items:center;">
						<img src="../../../image/icon/icon-comment.png" style="width:0.9rem;height:0.85rem;" />
						<div class="aui-font-size-12" style="margin-left:0.4rem;">
							{{vo.comment_num}}
						</div>
					</div>
					<div style="width:4rem;float:left;display:flex;align-items:center;">
						<img v-if="vo.is_share=='0'" src="../../../image/icon/icon-share.png" style="width:0.9rem;height:0.85rem;" />
						<img v-if="vo.is_share=='1'" src="../../../image/icon/icon-share-active.png" style="width:0.9rem;height:0.85rem;" />
						<div style="margin-left:0.4rem;">
							{{vo.repeat_num}}
						</div>
					</div>
				</div>
			</div>



		</div>
		<transition name="fade">

			<div v-if="backTopShow" tapmode onclick="backTop()" style="position: fixed;right: 0.75rem;bottom: 3rem;z-index: 99;">
				<img style="width: 2.75rem;" src="../../../image/btn/btn-gotop.png" />
			</div>
		</transition>
		<div v-if="info.length<1" class="aui-text-center none-any">
			<img src="../../../image/bg/bg-nonedan.png" />
			<div class="aui-margin-t-10 order-none">
				暂无信息
			</div>
		</div>

		<!--底部发布会员修按钮-->
		<div class="publishXiubtn">
			<div style="line-height:2.3rem;color:rgba(255,255,255,1);text-align:center;margin:auto;width:92%;height:2.3rem;background:rgba(0,90,147,1);border-radius:0.3rem;"  tapmode onclick="openwinFB()">
					发布会员秀
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="../../../script/api.js"></script>
<script type="text/javascript" src="../../../script/vue.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/aui-dialog.js"></script>
<script>
	var vm = new Vue({
		el: "#app",
		data: {
			info: [],
			page: 1,
			loadmore: true,
			backTopShow: false,
			userid:null,
		},

		methods: {
			videoPlay: function(path) {
				openWin('circle/video_new', {
					video: path
				})
			},
			get_list: function() {
				get_data('api/Xiaoyouquan/myXyqList', {
					token: $api.getStorage('token'),
					page: vm.page
				}, function(ret) {
					// alert(JSON.stringify(ret,null,2))
					if (ret.status) {
						if (ret.data.length < 20) {
							vm.loadmore = false
						} else {
							vm.loadmore = true
						}
						vm.info = ret.data;

						vm.loadmore = false
					}
				})
			},

			showimg: function(new_img_list, index) {
				var photoBrowser = api.require('photoBrowser');
				photoBrowser.open({
					images: new_img_list,
					activeIndex: index,
					placeholderImg: 'widget://res/img/apicloud.png',
					bgColor: '#000'
				}, function(ret, err) {
					if (ret) {
						if (ret.eventType == 'click') {
								 photoBrowser.close(); }
					} else {
						toast('图片加载失败');
					}
				});


			}
		},

	})

	apiready = function() {
		vm.get_list()
			//			fnInitPullRefresh(function() {
			//				vm.page = 1;
			//				vm.loadmore = true;
			//				vm.info = [];
			//				vm.get_list();
			//			})
		fnInitScrollToBottom(function() {
			if (vm.loadmore) {
				vm.page++;
				vm.get_list()
			}
		})
		add_event('publishok', function(ret) {
			vm.page = 1;
			vm.loadmore = true;
			vm.info = [];
			vm.get_list();

		})
		add_event('xyqedit', function(ret) {
			vm.page = 1;
			vm.loadmore = true;
			vm.info = [];
			vm.get_list();
		});
	};


	function next(status, id, is_comment) {
		if (status == '0') {
			openWin_circle_details_wsh(id)
		}
		if (status == '1') {
			openWin_circle_details(id, is_comment)
		}
		if (status == '-1') {
			openWin_circle_details_false(id)
		}
	}
	var timeOutEvent = 0;

	// function gtouchstart(index) {
	// 	timeOutEvent = setTimeout(function() {
	// 		longPress(index)
	// 	}, 500);
	// 	return false;
	// };

	function gtouchend() {
		clearTimeout(timeOutEvent);
		if (timeOutEvent != 0) {
			//这里写要执行的内容（尤如onclick事件）
			//			console.log("你这是点击，不是长按");
		}
		return false;
	};

	function gtouchmove() {
		clearTimeout(timeOutEvent);
		timeOutEvent = 0;
	};

	// function longPress(index) {
	// 	timeOutEvent = 0;
	// 	//执行长按要执行的内容，如弹出菜单
	// 	del(index)
	// }

	function del(id) {
		// var dialog = new auiDialog();
		// dialog.alert({
		// 	title: "提示",
		// 	msg: '确定要删除该条发布吗？',
		// 	buttons: ['取消', '确定']
		// }, function(ret) {
		// 	if(ret) {
		// 		if(ret.buttonIndex == '2') {
		// 			get_data('api/xiaoyouquan/xyqDelPublish', {
		// 				token: $api.getStorage('token'),
		// 				id: id
		// 			}, function(ret) {
		// 				if(ret.status) {
		// 					toast(ret.msg)
		// 					vm.page = 1;
		// 					vm.loadmore = true;
		// 					vm.info = [];
		// 					vm.get_list();
		// 				}
		// 			})
		// 		}
		// 	}
		// })

		var dialogBox = api.require('dialogBox');
		dialogBox.alert({
			texts: {
				title: '提示',
				content: '确定要删除该条发布吗？',
				leftBtnTitle: '取消',
				rightBtnTitle: '确定'
			},
			styles: {
				bg: '#fff',
				w: 295,
				corner: 10,
				title: {
					marginT: 20,
					titleSize: 17,
					titleColor: '#444444'
				},
				content: {
					marginT: 18,
					marginB: 30,
					color: '#444444',
					size: 17
				},
				left: {
					marginB: 0,
					marginL: 0,
					w: 147.5,
					h: 55,
					corner: 10,
					// bg: 'widget://image/ico/ico_btn_left_bg.png',
					bg: "#fff",
					color: '#999999',
					size: 16
				},
				right: {
					marginB: 0,
					marginL: 0,
					w: 147.5,
					h: 55,
					corner: 10,
					bg: '#fff',
					color: '#005A93',
					size: 16
				},
				horizontalLine: {
					color: '#EEEEEE',
					height: 1
				},
				verticalLine: {
					color: '#EEEEEE', //（可选项）字符串类型；左右按钮中间竖线的颜色，支持rgb、rgba、#；默认：'rgba(245,245,245,0)'
					width: 1 //（可选项）数字类型；左右边按钮竖线的高度；默认：0
				}
			}
		}, function(ret) {
			if (ret.eventType == 'left') {
				var dialogBox = api.require('dialogBox');
				dialogBox.close({
					dialogName: 'alert'
				});
			} else if (ret.eventType == 'right') {
				get_data('api/xiaoyouquan/xyqDelPublish', {
					token: $api.getStorage('token'),
					id: id

				}, function(ret) {
					if (ret.status) {
						toast(ret.msg)
						var dialogBox = api.require('dialogBox');
						dialogBox.close({
							dialogName: 'alert'
						});
						vm.page = 1;
						vm.loadmore = true;
						vm.info = [];
						vm.get_list();
					}
				})

			}
		});
	}

	function del(id) {
		// var dialog = new auiDialog();
		// dialog.alert({
		// 	title: "提示",
		// 	msg: '确定要删除该条发布吗？',
		// 	buttons: ['取消', '确定']
		// }, function(ret) {
		// 	if(ret) {
		// 		if(ret.buttonIndex == '2') {
		// 			get_data('api/xiaoyouquan/xyqDelPublish', {
		// 				token: $api.getStorage('token'),
		// 				id: id
		// 			}, function(ret) {
		// 				if(ret.status) {
		// 					toast(ret.msg)
		// 					vm.page = 1;
		// 					vm.loadmore = true;
		// 					vm.info = [];
		// 					vm.get_list();
		// 				}
		// 			})
		// 		}
		// 	}
		// })
		var dialogBox = api.require('dialogBox');
		dialogBox.alert({
			texts: {
				title: '提示',
				content: '确定要删除该条发布吗？',
				leftBtnTitle: '取消',
				rightBtnTitle: '确定'
			},
			styles: {
				bg: '#fff',
				w: 295,
				corner: 10,
				title: {
					marginT: 20,
					titleSize: 17,
					titleColor: '#444444'
				},
				content: {
					marginT: 18,
					marginB: 30,
					color: '#444444',
					size: 17
				},
				left: {
					marginB: 0,
					marginL: 0,
					w: 147.5,
					h: 55,
					corner: 10,
					// bg: 'widget://image/ico/ico_btn_left_bg.png',
					bg: "#fff",
					color: '#999999',
					size: 16
				},
				right: {
					marginB: 0,
					marginL: 0,
					w: 147.5,
					h: 55,
					corner: 10,
					bg: '#fff',
					color: '#005a93',
					size: 16
				},
				horizontalLine: {
					color: '#EEEEEE',
					height: 1
				},
				verticalLine: {
					color: '#EEEEEE', //（可选项）字符串类型；左右按钮中间竖线的颜色，支持rgb、rgba、#；默认：'rgba(245,245,245,0)'
					width: 1 //（可选项）数字类型；左右边按钮竖线的高度；默认：0
				}
			}
		}, function(ret) {
			if (ret.eventType == 'left') {
				var dialogBox = api.require('dialogBox');
				dialogBox.close({
					dialogName: 'alert'
				});
			} else if (ret.eventType == 'right') {
				get_data('api/xiaoyouquan/xyqDelPublish', {
					token: $api.getStorage('token'),
					id: id
				}, function(ret) {
					if (ret.status) {
						toast(ret.msg)
						vm.page = 1;
						vm.loadmore = true;
						vm.info = [];
						vm.get_list();
					}
				})
				var dialogBox = api.require('dialogBox');
				dialogBox.close({
					dialogName: 'alert'
				});
			}
		});
	}

	//下拉显示返回顶部菜单
	window.onscroll = function() {
		var t = document.documentElement.scrollTop || document.body.scrollTop;
		if (t > 100) {
			vm.backTopShow = true
		} else {
			vm.backTopShow = false
		}
	}

	// 回到顶部
	function backTop() {
		document.documentElement.scrollTop = 0
		document.body.scrollTop = 0
	}

	//打开发布页
	function openwinFB(){
		open_win('publish_edit', 'widget://html/my/publish/publish.html', false);
	}
</script>

</html>
